<template>
  <div class="app-container">
    <div class="filter-condition">
      <label>条件搜索</label>
      <el-form
        size="mini"
        :model="from"
        style="flex: 1;margin-bottom: 15px"
        class="mini-form"
      >
        <el-row>
          <el-col :span="4">
            <el-form-item label-width="2px">
              <el-input
                v-model="from.keyWord"
                placeholder="请输入工号/姓名/手机"
                prefix-icon="el-icon-search"
                clearable
                @change="handleChangeFilter"
              />
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="4px">
              <el-cascader
                v-model="from.departId"
                :options="departmentList"
                :props="departmentProps"
                placeholder="请选择部门"
                clearable
                @change="handleChangeFilter"
              />
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="4px">
              <el-select
                v-model="from.postIds"
                placeholder="请选择职位"
                multiple
                collapse-tags
                filterable
                clearable
                @change="handleChangeFilter"
              >
                <el-option
                  v-for="(item,index) in searchPostList"
                  :key="index"
                  :label="item.postName"
                  :value="item.postId"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label-width="4px">
              <el-select
                v-model="from.statusIds"
                multiple
                collapse-tags
                size="mini"
                placeholder="请选择状态"
                @change="handleChangeFilter"
              >
                <el-option
                  v-for="item in statusConstant"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label-width="10px">
              <el-date-picker
                v-model="dateRange"
                value-format="yyyy-MM-dd"
                class="search-date-picker"
                type="daterange"
                align="center"
                range-separator="-"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :picker-options="pickerOptions"
                @change="handleChangeDate"
              />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label-width="20px">
              <label class="bCheckProb">检查待转正</label>
              <el-checkbox
                v-model="from.bCheckProb"
                :true-label="1"
                :false-label="0"
                @change="handleBCheckProb"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <!-- <my-divider class="thin-divider" /> -->
    <el-row>
      <el-col :span="2">
        <label class="row-label">业务操作</label>
      </el-col>
      <el-col
        :span="22"
        class="align-right"
      >
        <!-- <dropdown-button
          :data="operationList"
          @click="handleOperate"
        /> -->
        <el-button-group>
          <el-button
            v-permission="'ADD'"
            type="primary"
            icon="el-icon-plus"
            @click="handleCreate"
          >
            {{ $t('table.add') }}
          </el-button>
          <!-- <el-button
            type="primary"
            icon="el-icon-chat-dot-round"
            @click="handleTips"
          >发卡</el-button> -->
          <el-button
            v-permission="'MODIFY'"
            type="primary"
            icon="el-icon-edit"
            @click="updateRecordSecurity"
          >一键修改社保</el-button>
          <el-dropdown
            trigger="click"
            @command="handleInputPersonnel"
          >
            <el-button
              type="primary"
              icon="el-icon-plus"
            >
              录入<i class="el-icon-arrow-down el-icon--right" />
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <!-- <el-dropdown-item
                icon="el-icon-thumb"
                command="finger"
              >指纹录入</el-dropdown-item> -->
              <el-dropdown-item
                icon="el-icon-user"
                command="face"
              >人脸注册</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          <el-button
            v-permission="'RESET'"
            type="primary"
            icon="el-icon-refresh-left"
            @click="handleReset"
          >
            密码重置
          </el-button>
          <el-button
            v-permission="'MODIFY'"
            type="primary"
            icon="el-icon-s-claim"
            @click="handleCheckProb"
          >
            批量转正
          </el-button>
          <el-button
            type="primary"
            icon="el-icon-place"
            @click="handleMacAddress"
          >
            绑定mac地址
          </el-button>
          <el-button
            v-permission="'PRINT'"
            type="primary"
            icon="el-icon-printer"
            @click="handlePrint"
          >
            {{ $t('table.print') }}
          </el-button>
          <el-button
            type="primary"
            icon="el-icon-refresh"
            class="refresh-button"
            @click="handleRefresh"
          >
            {{ $t('tagsView.refresh') }}
          </el-button>
        </el-button-group>
      </el-col>
    </el-row>
    <!-- <common-layout
      @aside-init="handleAsideInit"
      @node-click="handleNodeClick"
    > 
    <erp-common-table
        v-loading="listLoading"
        :data="list"
        :columns="tableColumn"
        index
        remote-sort
        selection
        :storage-key="GLOBAL.storageKey.HR_PERSONNEL_EMPLOYEE_MAIN"
        :operation="{show: true, update: true, delete: true}"
        @row-click="handleRowClick"
        @row-dblclick="handleUpdate"
        @row-update="handleUpdate"
        @row-delete="handleDelete"
        @sort-change="handleTableSort"
        @query="handleAdvancedQuery"
        @selection-change="handleSelectionChange"
      />
      <pagination
        v-show="total>0"
        small
        :total="total"
        :page.sync="listQuery.page"
        :limit.sync="listQuery.pageSize"
        @pagination="getList"
      /> 
    </common-layout> -->
    <el-dialog
      :key="dialogKey"
      :title="$t('route.employee') + '--' + $t('table.'+dialogStatus)"
      :visible.sync="dialogFormVisible"
      width="60%"
      top="1vh"
      :close-on-click-modal="false"
      custom-class="dialog-title-background"
    >
      <el-form
        ref="employeeDataForm"
        :rules="rules"
        :model="temp"
        label-position="right"
        label-width="85px"
        style="width: 100%;"
      >
        <el-tabs
          v-model="currentTab"
          class="tab-content"
          type="border-card"
          @tab-click="changeTab"
        >
          <el-tab-pane
            label="基本资料"
            name="dbInfo"
          >
            <el-row>
              <el-col :span="16">
                <el-row>
                  <el-form-item
                    label="身份证号"
                    prop="identNO"
                  >
                    <el-input
                      v-model="temp.identNO"
                      placeholder="身份证号"
                      size="mini"
                      @change="handleEmployeeChange"
                    />
                  </el-form-item>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item
                      label="所属集团"
                      prop="groupId"
                    >
                      <el-select
                        v-model="temp.groupId"
                        size="mini"
                        placeholder="请选择集团"
                        disabled
                        @change="handleGroupId"
                      >
                        <el-option
                          v-for="item in groups"
                          :key="item.groupId"
                          :label="item.groupName"
                          :value="item.groupId"
                        >
                          <span style="float: left">{{ item.groupCode }}</span>
                          <span style="float: right; color: #8492a6; font-size: 13px">{{ item.groupName }}</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item
                      label="员工编号"
                      prop="employeeCode"
                    >
                      <el-input
                        v-model="temp.employeeCode"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item
                      label="员工姓名"
                      prop="employeeName"
                    >
                      <el-input
                        v-model="temp.employeeName"
                        :disabled="!idCardPass"
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item
                      label="入职日期"
                      prop="inDate"
                    >
                      <el-date-picker
                        v-model="temp.inDate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        size="mini"
                        :clearable="false"
                        :disabled="!idCardPass"
                        placeholder="选择日期"
                        style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="组织">
                      <el-select
                        v-model="temp.organId"
                        size="mini"
                        placeholder="请选择组织"
                        :disabled="dialogStatus === 'add' ? true: false"
                        @change="handleOrganId"
                      >
                        <el-option
                          v-for="item in organIds"
                          :key="item.organId"
                          :label="item.organName"
                          :value="item.organId"
                        >
                          <span style="float: left">{{ item.organCode }}</span>
                          <span style="float: right; color: #8492a6; font-size: 13px">{{ item.organName }}</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item
                      label="职位"
                      prop="postId"
                    >
                      <table-dialog-input
                        ref="cusName"
                        v-model="temp.postId"
                        :dialog-title="'选择职位'"
                        :disabled="!idCardPass"
                        :default-label="temp.postName"
                        :data="postIds"
                        :table-column="postIdTableColumn"
                        :props="{label: 'postName', value: 'postId'}"
                        table-height="400px"
                        @select="setPosition"
                      />
                    </el-form-item>
                    <el-form-item label="部门">
                      <el-input
                        v-model="temp.departName"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item
                      label="手机"
                      prop="tel"
                    >
                      <el-input
                        v-model="temp.tel"
                        :disabled="!idCardPass"
                        size="mini"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-form-item
                    label="籍贯"
                    class="nativeCity"
                    prop="nativeCity"
                  >
                    <el-cascader
                      ref="regionCascader"
                      :props="regionProps"
                      clearable
                      :placeholder="temp.native ? temp.native : ''"
                      style="width: 100%"
                      :disabled="!idCardPass"
                      popper-class="cascader-poper"
                      @change="handleChangeRegion"
                    />
                  </el-form-item>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="区域">
                      <el-input
                        :value="temp.region"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item
                      label="民族"
                      prop="nationId"
                    >
                      <el-select
                        v-model="temp.nationId"
                        size="mini"
                        placeholder="请选择民族"
                        clearable
                        :disabled="!idCardPass"
                      >
                        <el-option
                          v-for="item in nationConstant"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id"
                        >
                          <span style="float: left">{{ item.id }}</span>
                          <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="省份">
                      <el-input
                        :value="temp.province"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item label="市区">
                      <el-input
                        :value="temp.city"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item label="县区">
                      <el-input
                        :value="temp.county"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                    <el-form-item label="镇区">
                      <el-input
                        :value="temp.town"
                        disabled
                        size="mini"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item
                      label="在职状态"
                      prop="statusId"
                    >
                      <el-select
                        v-model="temp.statusId"
                        size="mini"
                        :disabled="!idCardPass"
                        @change="handleStatusId"
                      >
                        <el-option
                          v-for="item in statusConstant"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id"
                        >
                          <span style="float: left">{{ item.id }}</span>
                          <span style="float: right; color: #8492a6;">{{ item.name }}</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col
                    v-if="temp.statusId === '03'"
                    :span="12"
                  >
                    <el-form-item
                      label="离职日期"
                      prop="outDate"
                    >
                      <el-date-picker
                        v-model="temp.outDate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        size="mini"
                        :disabled="!idCardPass"
                        placeholder="选择日期"
                        style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-col>
              <el-col
                :span="8"
                style="text-align: center"
              >
                <el-upload
                  :class="temp.photo? '' : 'img-box'"
                  action="#"
                  :show-file-list="false"
                  :auto-upload="false"
                  :on-change="addEmployeeAvatar"
                  style="width: 80%; margin: 0 auto"
                >
                  <img
                    v-if="temp.photo"
                    :src="multiFileUrl"
                    alt="照片"
                    style="height: 152px"
                  >
                  <div
                    v-else
                    class="upload-tip"
                  >
                    <i class="el-icon-upload upload-icon" />
                    <div class="el-upload__text"><em>点击上传照片</em></div>
                  </div>
                </el-upload>
              </el-col>
            </el-row>
          </el-tab-pane>
          <el-tab-pane label="详细资料">
            <el-form-item label="家庭住址">
              <el-input
                v-model="temp.homeAddr"
                placeholder="请输入家庭住址"
                size="mini"
              />
            </el-form-item>
            <el-form-item label="出生日期">
              <el-input
                v-model="temp.birth"
                disabled
                size="mini"
              />
            </el-form-item>
            <el-row>
              <el-col :span="8">
                <el-form-item
                  label="性别"
                  prop="genderId"
                >
                  <el-select
                    v-model="temp.genderId"
                    size="mini"
                    placeholder="请选择性别"
                    :disabled="!idCardPass"
                  >
                    <el-option
                      v-for="item in sexConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item />
                <el-form-item label="宿舍号">
                  <el-input
                    v-model="temp.houseName"
                    placeholder="宿舍号"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="联系人">
                  <el-input
                    v-model="temp.contacter"
                    placeholder="联系人"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item />
                <el-form-item
                  label="计薪方式"
                  prop="salaryCodeId"
                >
                  <el-select
                    v-model="temp.salaryCodeId"
                    size="mini"
                    :disabled="!idCardPass"
                  >
                    <el-option
                      v-for="item in salaryCodeConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="劳动合同">
                  <el-input
                    v-model="temp.laborContract"
                    placeholder="劳动合同"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="状态日期">
                  <el-input
                    v-model="temp.statusDate"
                    placeholder="状态日期"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="关联组织">
                  <el-select
                    v-model="temp.relations"
                    multiple
                    collapse-tags
                    clearable
                    pidlaceholder="请选择组织"
                    :disabled="showRelations"
                  >
                    <el-option
                      v-for="item in organIds"
                      :key="item.index"
                      :label="item.shortName"
                      :value="item.organId"
                    >
                      <span style="float: left">{{ item.organId }}</span>
                      <span style="float: right; color: #8492a6;">{{ item.shortName }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item
                  label="学历"
                  prop="educationId"
                >
                  <el-select
                    v-model="temp.educationId"
                    size="mini"
                    :disabled="!idCardPass"
                    clearable
                  >
                    <el-option
                      v-for="item in educationConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6;">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item />
                <el-form-item label="短号">
                  <el-input
                    v-model="temp.shortTel"
                    placeholder="短号"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="联系人手机">
                  <el-input
                    v-model="temp.contactTel"
                    placeholder="联系人手机"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item />
                <el-form-item
                  label="工资类别"
                  prop="salaryTypeId"
                >
                  <el-select
                    v-model="temp.salaryTypeId"
                    size="mini"
                    :disabled="!idCardPass"
                  >
                    <el-option
                      v-for="item in salaryTypeConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6;">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="社保卡号">
                  <el-input
                    v-model="temp.socialNO"
                    placeholder="社保卡号"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="离职方式">
                  <el-select
                    v-model="temp.leaveTypeId"
                    size="mini"
                    clearable
                    :disabled="!idCardPass"
                  >
                    <el-option
                      v-for="item in leaveTypeConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6;">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="银行卡号">
                  <el-input
                    v-model="temp.accountNum"
                    placeholder="银行卡号"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item
                  label="婚姻"
                  prop="marriageId"
                >
                  <el-select
                    v-model="temp.marriageId"
                    size="mini"
                    :disabled="!idCardPass"
                    clearable
                  >
                    <el-option
                      v-for="item in marriageConstant"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                      <span style="float: left">{{ item.id }}</span>
                      <span style="float: right; color: #8492a6;">{{ item.name }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item />
                <el-form-item label="座机号码">
                  <el-input
                    v-model="temp.localTel"
                    placeholder="座机号码"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="联系人关系">
                  <el-input
                    v-model="temp.contactRelat"
                    placeholder="联系人关系"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item />
                <el-form-item label="津贴级别">
                  <el-input-number
                    v-model="temp.subsidyLevel"
                    controls-position="right"
                    :min="0"
                    :max="8"
                  />
                </el-form-item>
                <el-form-item label="社保">
                  <el-input
                    v-model="temp.socialMoney"
                    placeholder="社保"
                    size="mini"
                  />
                </el-form-item>
                <el-form-item label="永不录用">
                  <el-radio-group v-model="temp.bIsUnLuYong">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="开户行">
                  <el-input
                    v-model="temp.accountBank"
                    placeholder="开户银行"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="备注">
              <el-input
                v-model="temp.note"
                type="textarea"
                :rows="2"
                placeholder="备注内容"
              />
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="身份证照片">
            <el-form-item>
              <el-upload
                :class="temp.identPhotoA ? '' : 'img-box'"
                action="#"
                :show-file-list="false"
                :auto-upload="false"
                :on-change="addEmployeeIDCardA"
              >
                <img
                  v-if="temp.identPhotoA"
                  :src="multiFile_AUrl"
                  :alt="temp.employeeName"
                  style="width: 290px"
                >
                <div
                  v-else
                  class="upload-tip"
                >
                  <i class="el-icon-upload upload-icon" />
                  <div class="el-upload__text"><em>点击上传照片</em></div>
                </div>
              </el-upload>
            </el-form-item>
            <el-form-item>
              <el-upload
                :class="temp.identPhotoB ? '' : 'img-box'"
                action="#"
                :show-file-list="false"
                :auto-upload="false"
                :on-change="addEmployeeIDCardB"
              >
                <img
                  v-if="temp.identPhotoB"
                  :src="multiFile_BUrl"
                  :alt="temp.employeeName"
                  style="width: 290px"
                >
                <div
                  v-else
                  class="upload-tip"
                >
                  <i class="el-icon-upload upload-icon" />
                  <div class="el-upload__text"><em>点击上传照片</em></div>
                </div>
              </el-upload>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane
            v-if="dialogStatus !== 'add'"
            label="修改记录"
            name="histroy"
          >
            <erp-common-table
              v-loading="recordHistoryLoading"
              :data="recordHistory"
              :columns="recordHistoryTable"
              index
              height="200px"
              :storage-key="GLOBAL.storageKey.HR_PERSONNEL_EMPLOYEE_UPDATE"
              :operation="{show: false}"
            />
            <div
              style="margin-top: 5px"
              class="history-remark"
            >
              <span>个人记录</span>
              <el-input
                v-model="temp.remark"
                type="textarea"
                :rows="12"
                disabled
              />
            </div>
          </el-tab-pane>
        </el-tabs>
      </el-form>
      <div
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          class="pause-button"
          @click="handleCancel"
        >
          {{ $t('table.cancel') }}
        </el-button>
        <el-button
          type="primary"
          @click="handleConfirm"
        >
          {{ $t('table.confirm') }}
        </el-button>
      </div>
    </el-dialog>
    <!-- <PrintEmployee
      :visible.sync="innerVisiblePrintEmployee"
      :data="printData"
      :loading="printLoading"
    /> -->
    <el-dialog
      title="修改社保"
      :visible.sync="recordSecurityVisible"
      width="30%"
      custom-class="dialog-title-background"
    >
      <a-input
        v-model.number="socialMoney"
        placeholder="请输入社保金额"
        @pressEnter="sureFind"
      />
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          class="pause-button"
          @click="recordSecurityVisible = false"
        >取 消</el-button>
        <el-button
          type="primary"
          @click="sureFind"
        >确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="指纹录入"
      :visible.sync="FingerInputVisible"
      width="30%"
      custom-class="dialog-title-background"
    >
      <el-form
        ref="fingerInputForm"
        :model="fingerInputForm"
        :rules="fingerInputRules"
        label-width="100px"
        style="width:80%"
      >
        <el-form-item
          label="IP地址："
          prop="intranet"
        >
          <table-dialog-input
            ref="fingerInput"
            v-model="fingerInputForm.intranet"
            :dialog-title="'选择IP地址'"
            :default-label="fingerInputForm.intranet"
            :data="attendanceData"
            :table-column="attendanceColumn"
            :props="{label: 'intranetNet', value: 'id'}"
            table-height="400px"
            @select="setIntranet"
          />
        </el-form-item>
        <el-form-item label="指纹：">
          <el-image
            style="width:100px;height:100px;text-align:center;line-height:100px;border:1px solid #ccc"
            :src="fingerInputUrl"
          >
            <div
              slot="error"
              class="image-slot"
            >
              <i
                class="el-icon-picture-outline"
                style="font-size:30px"
              />
            </div>
          </el-image>
          <el-image
            style="width:100px;height:100px;text-align:center;line-height:100px;border:1px solid #ccc"
            :src="fingerInputUrlA"
          >
            <div
              slot="error"
              class="image-slot"
            >
              <i
                class="el-icon-picture-outline"
                style="font-size:30px"
              />
            </div>
          </el-image>
          <el-image
            style="width:100px;height:100px;text-align:center;line-height:100px;border:1px solid #ccc"
            :src="fingerInputUrlB"
          >
            <div
              slot="error"
              class="image-slot"
            >
              <i
                class="el-icon-picture-outline"
                style="font-size:30px"
              />
            </div>
          </el-image>
        </el-form-item>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="FingerInputVisible = false">取 消</el-button>
        <el-button
          type="primary"
          :disabled="resetDisabled"
          @click="handleResetConnect"
        >重新连接</el-button>
        <el-button
          type="primary"
          :loading="sureFindLoading"
          @click="FingerInputSureFind"
        >确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="发卡操作提示"
      width="500px"
      :visible.sync="hairpinrVisible"
      custom-class="dialog-title-background"
    >
      <el-form
        ref="HairpinForm"
        :rules="hairpinRules"
        :model="hairpinrForm"
        label-position="right"
        label-width="40px"
        class="mini-form"
        size="mini"
      >
        <el-form-item>
          <p style="font-size:20px;color:orange">请打开消费卡软件，并把当前消费ID<span style="color:red">{{ hairpinrForm.id }}</span>填入!</p>
        </el-form-item>
      </el-form>
    </el-dialog>
    <el-dialog
      title="绑定mac地址"
      width="500px"
      :visible.sync="addressVisible"
      custom-class="dialog-title-background"
    >
      <el-input
        v-model="macAddress"
        placeholder="请输入mac地址"
      />
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="addressVisible = false">取 消</el-button>
        <el-button
          type="primary"
          @click="handleConfirmMacAddress"
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 人脸注册 -->
    <el-dialog
      title="人脸注册"
      :visible.sync="FaceInputVisible"
      width="30%"
      custom-class="dialog-title-background"
    >
      <el-form
        ref="faceInputForm"
        :model="faceInputForm"
        :rules="faceInputRules"
        label-width="100px"
        style="width:80%"
      >
        <el-form-item
          label="IP地址："
          prop="intranet"
        >
          <table-dialog-input
            ref="fingerInput"
            v-model="faceInputForm.intranet"
            :dialog-title="'选择IP地址'"
            :default-label="faceInputForm.intranet"
            :data="faceAttendanceData"
            :table-column="attendanceColumn"
            :props="{label: 'intranetNet', value: 'id'}"
            table-height="400px"
            @select="setFaceIntranet"
          />
        </el-form-item>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          class="pause-button"
          @click="FaceInputVisible = false"
        >取 消</el-button>
        <el-button
          :loading="faceLoading"
          type="primary"
          @click="faceInputSureFind"
        >确 定</el-button>
      </span>
    </el-dialog>
    <!-- 子账号 -->
    <el-dialog
      :title="subAccountTitle"
      :visible.sync="subAccountVisible"
      width="30%"
      custom-class="dialog-title-background"
    >
      <el-form
        ref="subAccountForm"
        :model="subAccountForm"
        :rules="subAccountRules"
        label-width="100px"
        style="width:80%"
      >
        <el-form-item
          prop="subPassword"
          label="密码"
        >
          <el-input
            v-model="subAccountForm.subPassword"
            placeholder="请输入密码"
            auto-complete="off"
            :type="passwordType"
          />
          <span
            class="show-pwd"
            @click="showPwd()"
          >
            <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
          </span>
        </el-form-item>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          class="pause-button"
          @click="subAccountVisible = false"
        >取 消</el-button>
        <el-button
          :loading="accountLoading"
          type="primary"
          @click="setSubAccount"
        >确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
// import waves from '@/directive/waves'
// import ErpCommonTable from '@/views/components-erp/ErpCommonTable'
// import TableDialogInput from '@/components/TableDialogInput'
// import Pagination from '@/components/Pagination'
import { getList, addOneByForm, updateOneByForm, deleteBatch, selectOne } from '@/api/basic-data'
import { updateOne, insertOne } from '@/api/hr'
import ProduceManageAPI from '@/api/produce-manage'
// import { validIDCode } from '@/utils/validate'
// import { getNameById } from '@/utils/erp.js'
// import MyDivider from '@/components/Divider/MyDivider'
// import PrintEmployee from '../components/PrintEmployee'
// import { fileToURL, compressImage } from '@/utils/media'
import axios from 'axios'
// import DropdownButton from '@/components/DropdownButton'
import { SystemSettingAPI } from '@/api/system-setting'

export default {
  name: 'Employee',
  components: {
    // Pagination,
    // ErpCommonTable,
    // TableDialogInput,
    // MyDivider,
    // PrintEmployee,
    // DropdownButton
  },
  // directives: { waves },
  data() {
    var validatePass = (rule, value, callback) => {
      // 必须包含大小写字母、数字、特殊字符长度再8-20位之间
      const strLengthRule = value.toString().length < 8 || value.toString().length > 20
      // var rule = new RegExp('^.{8,20}').test(value)
      const validateList = []
      validateList[0] = new RegExp('(?=.*[0-9])').test(value)
      validateList[1] = new RegExp('(?=.*[A-Z])').test(value)
      validateList[2] = new RegExp('(?=.*[a-z])').test(value)
      validateList[3] = new RegExp('(?=.*[^a-zA-Z0-9])').test(value)
      if (!value) {
        callback(new Error('请输入新密码'))
      } else if (strLengthRule || validateList.filter(item => item).length < 3) {
        callback(new Error('密码长度8-20位且至少包含大写字母、小写字母、数字或特殊字符中任意三项'))
      } else {
        callback()
      }
    }
    return {
      from: {
        keyWord: '',
        departId: '',
        postIds: [],
        statusIds: ['01', '02'],
        beginDate: '',
        endDate: '',
        bCheckProb: 0
      },
      // 子账号相关
      operationList: [
        {
          name: '设置子账号',
          command: 'sets'
        },
        {
          name: '取消子账号',
          command: 'cancels'
        }
      ],
      filterCondition: {
        groupId: '',
        organId: '',
        sortName: '',
        sortType: 0,
        filter: ''
      },
      constants: [], // type => 1:在职状态;2:性别;3:学历;4:婚姻状态;5:计薪方式;6:离职状态;7:工资类别;8:民族
      positionConstants: [],
      regionProps: {
        expandTrigger: 'click',
        label: 'regionName',
        value: 'regionId',
        emitPath: true,
        lazy: true,
        lazyLoad(node, resolve) {
          let fatherId
          if (node.level === 0) {
            fatherId = 0
          } else {
            fatherId = node.data.regionId
          }
          getList('region', { fatherId: fatherId }).then(res => {
            const tmpList = res.data.pageItems
            resolve(tmpList)
          })
        }
      },
      saasTableColumn: [
        {
          name: '子账号',
          prop: 'haveAccount',
          type: 'booleanColumn'
        },
        {
          name: '职员ID',
          prop: 'employeeId',
          show: false
        },
        {
          name: '考勤记录ID',
          prop: 'attendanceId',
          show: false
        },
        {
          name: '消费ID',
          prop: 'consumerId',
          show: true
        },
        {
          name: 'mac地址',
          prop: 'macAddress'
        },
        {
          name: '人脸注册',
          prop: 'faceRecognition',
          type: 'checkbox'
        },
        {
          name: '工号',
          prop: 'employeeCode',
          width: '90px'
        },
        {
          name: '姓名',
          prop: 'employeeName'
        },
        {
          name: '联系手机',
          prop: 'tel',
          width: '110px'
        },
        {
          name: '集团Id',
          prop: 'groupId',
          show: false
        },
        {
          name: '集团',
          prop: 'groupName',
          width: '80px'
        },
        {
          name: '组织Id',
          prop: 'organId',
          show: false
        },
        {
          name: '组织',
          prop: 'organName',
          width: '150px'
        },
        {
          name: '部门Id',
          prop: 'departId',
          show: false
        },
        {
          name: '部门',
          prop: 'departName',
          width: '110px'
        },
        {
          name: '职位Id',
          prop: 'postId',
          show: false
        },
        {
          name: '职位',
          prop: 'postName',
          width: '110px'
        },
        {
          name: '就职状态Id',
          prop: 'statusId',
          show: false
        },
        {
          name: '就职状态',
          prop: 'status'
        },
        {
          name: '入职日期',
          prop: 'inDate',
          width: '135px'
        },
        {
          name: '离职日期',
          prop: 'outDate',
          show: false
        },
        {
          name: '录入指纹',
          prop: 'canFinger',
          type: 'checkbox'
        },
        {
          name: '籍贯',
          prop: 'native',
          width: '300px'
        },
        {
          name: '民族Id',
          prop: 'nationId',
          show: false
        },
        {
          name: '民族',
          prop: 'nation',
          width: '90px'
        },
        {
          name: '身份证号',
          prop: 'identNO',
          width: '180px'
        },
        {
          name: '区域Id',
          prop: 'regionId',
          show: false
        },
        {
          name: '区域',
          prop: 'region'
        },
        {
          name: '省Id',
          prop: 'provinceId',
          show: false
        },
        {
          name: '省',
          prop: 'province'
        },
        {
          name: '城市Id',
          prop: 'cityId',
          show: false
        },
        {
          name: '城市',
          prop: 'city'
        },
        {
          name: '县区Id',
          prop: 'countyId',
          show: false
        },
        {
          name: '县区',
          prop: 'county'
        },
        {
          name: '镇Id',
          prop: 'townId',
          show: false
        },
        {
          name: '镇',
          prop: 'town'
        },
        {
          name: '创建时间',
          prop: 'createTime'
        },
        {
          name: '创建人Id',
          prop: 'createId'
        },
        {
          name: '创建人名称',
          prop: 'createName'
        },
        {
          name: '修改时间',
          prop: 'modifyTime'
        },
        {
          name: '修改人Id',
          prop: 'modifyId'
        },
        {
          name: '修改人名称',
          prop: 'modifyName'
        },
        {
          name: '家庭住址',
          prop: 'homeAddr',
          show: false
        },
        {
          name: '性别ID',
          prop: 'genderId',
          show: false
        },
        {
          name: '性别',
          prop: 'gender'
        },
        {
          name: '学历ID',
          prop: 'educationId',
          show: false
        },
        {
          name: '学历',
          prop: 'education'
        },
        {
          name: '婚姻ID',
          prop: 'marriageId',
          show: false
        },
        {
          name: '婚姻',
          prop: 'marriage'
        },
        {
          name: '出生日期',
          prop: 'birth'
        },
        {
          name: '宿舍',
          prop: 'houseName',
          show: false
        },
        {
          name: '短号',
          prop: 'shortTel',
          show: false
        },
        {
          name: '座机号',
          prop: 'localTel',
          show: false
        },
        {
          name: '联系人',
          prop: 'contacter',
          show: false
        },
        {
          name: '联系人手机',
          prop: 'contactTel',
          show: false
        },
        {
          name: '联系人关系',
          prop: 'contactRelat',
          show: false
        },
        {
          name: '计薪方式ID',
          prop: 'salaryCodeId',
          show: false
        },
        {
          name: '计薪方式',
          prop: 'salaryCode'
        },
        {
          name: '工资类别ID',
          prop: 'salaryTypeId',
          show: false
        },
        {
          name: '工资类别',
          prop: 'salaryType'
        },
        {
          name: '津贴级别',
          prop: 'subsidyLevel'
        },
        {
          name: '银行卡号',
          prop: 'accountNum'
        },
        {
          name: '开户银行',
          prop: 'accountBank'
        },
        {
          name: '劳动合同',
          prop: 'laborContract',
          show: false
        },
        {
          name: '社保卡号',
          prop: 'socialNO',
          show: false
        },
        {
          name: '社保金额',
          prop: 'socialMoney',
          show: false
        },
        {
          name: '状态日期',
          prop: 'statusDate',
          show: false
        },
        {
          name: '离职方式ID',
          prop: 'leaveTypeId',
          show: false
        },
        {
          name: '离职方式',
          prop: 'leaveType',
          show: false
        },
        {
          name: '永不录用',
          prop: 'bIsUnLuYong',
          type: 'checkbox',
          show: false
        },
        {
          name: '备注',
          prop: 'note',
          show: false
        }
      ],
      tableColumn: [
        {
          name: '职员ID',
          prop: 'employeeId',
          show: false
        },
        {
          name: '考勤记录ID',
          prop: 'attendanceId',
          show: false
        },
        {
          name: '消费ID',
          prop: 'consumerId',
          show: true
        },
        {
          name: 'mac地址',
          prop: 'macAddress'
        },
        {
          name: '人脸注册',
          prop: 'faceRecognition',
          type: 'checkbox'
        },
        {
          name: '工号',
          prop: 'employeeCode',
          width: '90px'
        },
        {
          name: '姓名',
          prop: 'employeeName'
        },
        {
          name: '联系手机',
          prop: 'tel',
          width: '110px'
        },
        {
          name: '集团Id',
          prop: 'groupId',
          show: false
        },
        {
          name: '集团',
          prop: 'groupName',
          width: '80px'
        },
        {
          name: '组织Id',
          prop: 'organId',
          show: false
        },
        {
          name: '组织',
          prop: 'organName',
          width: '150px'
        },
        {
          name: '部门Id',
          prop: 'departId',
          show: false
        },
        {
          name: '部门',
          prop: 'departName',
          width: '110px'
        },
        {
          name: '职位Id',
          prop: 'postId',
          show: false
        },
        {
          name: '职位',
          prop: 'postName',
          width: '110px'
        },
        {
          name: '就职状态Id',
          prop: 'statusId',
          show: false
        },
        {
          name: '就职状态',
          prop: 'status'
        },
        {
          name: '入职日期',
          prop: 'inDate',
          width: '135px'
        },
        {
          name: '离职日期',
          prop: 'outDate',
          show: false
        },
        {
          name: '录入指纹',
          prop: 'canFinger',
          type: 'checkbox'
        },
        {
          name: '籍贯',
          prop: 'native',
          width: '300px'
        },
        {
          name: '民族Id',
          prop: 'nationId',
          show: false
        },
        {
          name: '民族',
          prop: 'nation',
          width: '90px'
        },
        {
          name: '身份证号',
          prop: 'identNO',
          width: '180px'
        },
        {
          name: '区域Id',
          prop: 'regionId',
          show: false
        },
        {
          name: '区域',
          prop: 'region'
        },
        {
          name: '省Id',
          prop: 'provinceId',
          show: false
        },
        {
          name: '省',
          prop: 'province'
        },
        {
          name: '城市Id',
          prop: 'cityId',
          show: false
        },
        {
          name: '城市',
          prop: 'city'
        },
        {
          name: '县区Id',
          prop: 'countyId',
          show: false
        },
        {
          name: '县区',
          prop: 'county'
        },
        {
          name: '镇Id',
          prop: 'townId',
          show: false
        },
        {
          name: '镇',
          prop: 'town'
        },
        {
          name: '创建时间',
          prop: 'createTime'
        },
        {
          name: '创建人Id',
          prop: 'createId'
        },
        {
          name: '创建人名称',
          prop: 'createName'
        },
        {
          name: '修改时间',
          prop: 'modifyTime'
        },
        {
          name: '修改人Id',
          prop: 'modifyId'
        },
        {
          name: '修改人名称',
          prop: 'modifyName'
        },
        {
          name: '家庭住址',
          prop: 'homeAddr',
          show: false
        },
        {
          name: '性别ID',
          prop: 'genderId',
          show: false
        },
        {
          name: '性别',
          prop: 'gender'
        },
        {
          name: '学历ID',
          prop: 'educationId',
          show: false
        },
        {
          name: '学历',
          prop: 'education'
        },
        {
          name: '婚姻ID',
          prop: 'marriageId',
          show: false
        },
        {
          name: '婚姻',
          prop: 'marriage'
        },
        {
          name: '出生日期',
          prop: 'birth'
        },
        {
          name: '宿舍',
          prop: 'houseName',
          show: false
        },
        {
          name: '短号',
          prop: 'shortTel',
          show: false
        },
        {
          name: '座机号',
          prop: 'localTel',
          show: false
        },
        {
          name: '联系人',
          prop: 'contacter',
          show: false
        },
        {
          name: '联系人手机',
          prop: 'contactTel',
          show: false
        },
        {
          name: '联系人关系',
          prop: 'contactRelat',
          show: false
        },
        {
          name: '计薪方式ID',
          prop: 'salaryCodeId',
          show: false
        },
        {
          name: '计薪方式',
          prop: 'salaryCode'
        },
        {
          name: '工资类别ID',
          prop: 'salaryTypeId',
          show: false
        },
        {
          name: '工资类别',
          prop: 'salaryType'
        },
        {
          name: '津贴级别',
          prop: 'subsidyLevel'
        },
        {
          name: '银行卡号',
          prop: 'accountNum'
        },
        {
          name: '开户银行',
          prop: 'accountBank'
        },
        {
          name: '劳动合同',
          prop: 'laborContract',
          show: false
        },
        {
          name: '社保卡号',
          prop: 'socialNO',
          show: false
        },
        {
          name: '社保金额',
          prop: 'socialMoney',
          show: false
        },
        {
          name: '状态日期',
          prop: 'statusDate',
          show: false
        },
        {
          name: '离职方式ID',
          prop: 'leaveTypeId',
          show: false
        },
        {
          name: '离职方式',
          prop: 'leaveType',
          show: false
        },
        {
          name: '永不录用',
          prop: 'bIsUnLuYong',
          type: 'checkbox',
          show: false
        },
        {
          name: '备注',
          prop: 'note',
          show: false
        }
      ],
      list: [],
      total: 0,
      listLoading: true,
      listQuery: {
        page: 1,
        pageSize: 50
      },
      temp: {
        // 必选字段
        birth: this.$moment().format('YYYY-MM-DD'),
        employeeId: '',
        employeeName: '',
        tel: '',
        groupId: '',
        organId: '',
        departId: '',
        postId: '',
        employeeCode: '',
        statusId: '01',
        inDate: '',
        identNO: '',
        nationId: '',
        regionId: '',
        provinceId: '',
        cityId: '',
        countyId: '',
        townId: '',
        genderId: '',
        educationId: '',
        marriageId: '',
        salaryCodeId: '',
        salaryTypeId: '',
        photo: '',
        identPhotoA: '',
        identPhotoB: '',
        // 可选字段
        homeAddr: '',
        houseName: '',
        shortTel: '',
        localTel: '',
        contacter: '',
        contactTel: '',
        contactRelat: '',
        subsidyLevel: '',
        laborContract: '',
        relations: '',
        socialNO: '',
        socialMoney: '',
        leaveTypeId: '',
        note: '',
        remark: '',
        outDate: null,
        bIsUnLuYong: 1,
        accountBank: '',
        accountNum: '',
        statusDate: '',
        // 额外字段 名称
        departName: '',
        postName: '',
        status: '',
        native: '',
        region: '',
        province: '',
        city: '',
        county: '',
        town: ''
      },
      dialogFormVisible: false,
      dialogStatus: 'add',
      textMap: {
        update: 'Edit',
        create: 'Create'
      },
      downloadLoading: false,
      groups: [],
      organIds: [],
      postIds: [],
      postIdTableColumn: [
        {
          name: '编制工号',
          prop: 'postLevelCode',
          filter: true
        },
        {
          name: '集团名称',
          prop: 'groupName'
        },
        {
          name: '组织名称',
          prop: 'organName',
          width: '150px'
        },
        {
          name: '部门名称',
          prop: 'departName'
        },
        {
          name: '职位名称',
          prop: 'postName',
          filter: true
        }
      ],
      departmentList: [],
      departmentProps: {
        expandTrigger: 'hover',
        label: 'name',
        value: 'id',
        emitPath: false,
        checkStrictly: true
      },
      searchPostList: [],
      showRelations: false,
      innerVisiblePrintEmployee: false,
      currentRow: '',
      pickerOptions: {
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
            picker.$emit('pick', [start, end])
          }
        }]
      },
      dateRange: '',
      dialogKey: 0,
      recordHistory: [],
      recordHistoryTable: [
        {
          name: '类型',
          prop: 'operType',
          width: '80px'
        },
        {
          name: '修改前',
          prop: 'oldOper',
          width: '150px'
        },
        {
          name: '修改后',
          prop: 'newOper',
          width: '150px'
        },
        {
          name: '操作人',
          prop: 'operName',
          width: '80px'
        },
        {
          name: '操作时间',
          prop: 'operTime'
        }
      ],
      recordHistoryLoading: false,
      currentTab: 'dbInfo',
      imgs: {
        photo: '',
        identPhotoA: '',
        identPhotoB: ''
      },
      multipleSelection: [],
      printLoading: false,
      printData: [],
      socialMoney: '',
      recordSecurityVisible: false,
      attendanceData: [],
      faceAttendanceData: [],
      attendanceColumn: [
        {
          name: '考勤机id',
          prop: 'id'
        },
        {
          name: '机器号',
          prop: 'dwMachineCode'
        },
        {
          name: '内网地址',
          prop: 'intranetNet'
        },
        {
          name: '端口号',
          prop: 'port'
        },
        {
          name: '机器名',
          prop: 'machine'
        },
        {
          name: '放置位置',
          prop: 'position'
        }
      ],
      fingerInputForm: {
        intranet: '',
        number: '',
        dwMachineNumber: '',
        port: '',
        name: ''
      },
      fingerInputRules: {
      },
      FingerInputVisible: false,
      timeId: '',
      FingerInputImage: '',
      FingerInputImageA: '',
      FingerInputImageB: '',
      baseFinger: '',
      hairpinrVisible: false,
      hairpinrForm: {
        id: ''
      },
      hairpinRules: {},
      resetDisabled: false,
      sureFindLoading: false,
      resFlog: false,
      // 绑定mac地址
      macAddress: '',
      addressVisible: false,
      // 人脸注册
      FaceInputVisible: false,
      faceInputForm: {
        intranet: '',
        password: '',
        port: ''
      },
      faceLoading: false,
      faceInputRules: {},
      // 子账号
      subAccountVisible: false,
      subAccountTitle: '',
      resetAccountStatus: false,
      subAccountForm: {
        subPassword: ''
      },
      passwordType: 'password',
      accountLoading: false,
      subAccountRules: {
        subPassword: [{ required: true, validator: validatePass, trigger: 'blur' }]
      },
      errorList: [],
      content: '',
      correctList: [],
      currentPlus: 0,
      currentErrPlus: 0,
      statusFlag: false
    }
  },
  computed: {
    rules: function () {
      const validateIdentNO = (rule, value, callback) => {
        if (!value) callback()
        if (!validIDCode(value)) {
          callback(new Error('请输入合法身份证'))
        } else {
          callback()
        }
      }
      // const validatorNativeCity = (rule, value, callback) => {
      //   if (!this.temp.region) {
      //     callback(new Error('请选择籍贯'))
      //   } else {
      //     callback()
      //   }
      // }
      return {
        identNO: [
          // { required: true, message: '请输入身份证', trigger: 'blur' },
          { validator: validateIdentNO, trigger: 'change' }
        ],
        employeeName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
        tel: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
        postId: [{ required: true, message: '请选择职位', trigger: 'blur' }],
        statusId: [{ required: true, message: '请选择在职状态', trigger: 'blur' }],
        inDate: [{ required: true, message: '请选择入职日期', trigger: 'blur' }],
        // nationId: [{ required: true, message: '请选择民族', trigger: 'blur' }],
        regionId: [{ required: true, trigger: 'blur' }],
        provinceId: [{ required: true, trigger: 'blur' }],
        cityId: [{ required: true, trigger: 'blur' }],
        countyId: [{ required: true, trigger: 'blur' }],
        townId: [{ required: true, trigger: 'blur' }],
        genderId: [{ required: true, message: '请选择性别', trigger: 'blur' }],
        // educationId: [{ required: true, message: '请选择学历', trigger: 'blur' }],
        // marriageId: [{ required: true, message: '请选择婚姻状态', trigger: 'blur' }],
        salaryCodeId: [{ required: true, message: '请选择计薪方式', trigger: 'blur' }],
        salaryTypeId: [{ required: true, message: '请选择工资类别', trigger: 'blur' }]
        // nativeCity: [{ required: true, validator: validatorNativeCity }]
      }
    },
    multiFileUrl: function () {
      return 'data:image/png;base64,' + this.temp.photo
    },
    multiFile_AUrl: function () {
      return 'data:image/png;base64,' + this.temp.identPhotoA
    },
    multiFile_BUrl: function () {
      return 'data:image/png;base64,' + this.temp.identPhotoB
    },
    fingerInputUrl: function () {
      return 'data:image/png;base64,' + this.FingerInputImage
    },
    fingerInputUrlA: function () {
      return 'data:image/png;base64,' + this.FingerInputImageA
    },
    fingerInputUrlB: function () {
      return 'data:image/png;base64,' + this.FingerInputImageB
    },
    statusConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 1)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    sexConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 2)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    educationConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 3)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    marriageConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 4)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    salaryCodeConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 5)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    leaveTypeConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 6)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    salaryTypeConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 7)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    nationConstant: function () {
      const tmp = this.constants.filter(constant => constant.type === 8)
      if (tmp && tmp.length > 0) {
        return tmp[0].data
      }
      return []
    },
    tempGroupName: function () {
      return getNameById(this.asideData, this.temp.groupId)
    },
    tempOrganName: function () {
      return getNameById(this.asideData, this.temp.organId)
    },
    idCardPass: function () {
      // return validIDCode(this.temp.identNO)
      return true
    },
    birth: function () {
      // 15位校验规则 6位地址编码+6位出生日期+3位顺序号
      // 18位校验规则 6位地址编码+8位出生日期+3位顺序号+1位校验位
      if (this.idCardPass) {
        if (this.temp.identNO.length === 15) {
          return this.temp.identNO.substring(6, 12)
        }
        if (this.temp.identNO.length === 18) {
          return this.temp.identNO.substring(6, 14)
        }
        return ''
      } else {
        return ''
      }
    }
  },
  watch: {
    'temp.salaryTypeId': function (val) {
      if (val === '18' || val === '19' || val === '21' || val === '22') {
        this.showRelations = false
      } else {
        this.showRelations = true
      }
    },
    'FingerInputVisible': function (val) {
      if (this.FingerInputVisible) {
        this.getAttendanceData()
        this.getFingerprintTemplate()
        this.timeId = setInterval(() => {
          this.handleFingerInformation()
        }, 1500)
      } else if (this.FingerInputVisible === false) {
        clearInterval(this.timeId)
        this.sureFindLoading = false
        this.clearFingerInputForm()
      }
    },
    'FaceInputVisible': function (val) {
      if (val) {
        this.getAttendanceData()
      } else {
        this.faceLoading = false
      }
    },
    currentPlus: function (val) {
      if (val + this.currentErrPlus === this.multipleSelection.length) {
        this.faceOverTips()
      }
    },
    currentErrPlus: function (val) {
      if (val + this.currentPlus === this.multipleSelection.length) {
        this.faceOverTips()
      }
    }
  },
  created() {
    this.init()
  },
  methods: {
    init: async function () {
      // this.getEmployeeConstant()
      // this.getGroups()
    },
    async getEmployeeConstant() {
      const res = await getList('employeeConstant')
      this.constants = res.data.pageItems
    },
    async getList() {
      this.listLoading = true
      const params = Object.assign({}, this.filterCondition, this.listQuery, this.from)
      const res = await selectOne('employee', params)
      this.list = res.data.pageItems
      this.total = res.data.total
      this.listLoading = false
    },
    async getGroups() {
      const res = await getList('group')
      this.groups = res.data.pageItems
      this.getOrganIds(this.filterCondition.groupId)
      this.getPostIds(this.filterCondition.organId)
    },
    async getOrganIds(val) {
      const temp = {
        groupId: val
      }
      const res = await getList('organization', temp)
      this.organIds = res.data.pageItems
    },
    async getPostIds(organId) {
      const temp = {
        groupId: this.filterCondition.groupId,
        organId: organId
      }
      const res = await getList('unUsedPostLevelCode', temp)
      this.postIds = res.data.pageItems
    },
    handleOrganId(val) {
      this.getPostIds(val)
    },
    async getDepartId() {
      const params = Object.assign({}, this.filterCondition)
      const type = this.filterCondition.organId ? 'departmentOfOrgan' : 'departmentOfGroup'
      const res = await getList(type, params)
      this.departmentList = res.data.pageItems
    },
    async getSearchPost() {
      const params = Object.assign({}, this.filterCondition)
      const res = await getList('position', params)
      this.searchPostList = res.data.pageItems
    },
    handleGroupId(val) {
      this.getOrganIds(val)
    },
    setTemp(tmp) {
      Object.assign(this.temp, tmp)
    },
    resetTemp() {
      const keys = Object.keys(this.temp)
      for (const key of keys) {
        if (key === 'statusId') {
          this.temp[key] = '01'
        } else if (key === 'bIsUnLuYong') {
          this.temp[key] = 0
        } else {
          this.temp[key] = ''
        }
      }
    },
    handleAsideInit(groupId, organId) {
      this.filterCondition.groupId = groupId
      if (organId) {
        this.filterCondition.organId = organId
      } else {
        delete this.filterCondition.organId
      }
      this.getDepartId()
      this.getSearchPost()
      this.getList()
      this.getMachine()
    },
    handleReset() {
      if (this.multipleSelection.length === 0) {
        return this.$message({
          showClose: true,
          message: '请勾选一条数据',
          type: 'warning',
          center: true
        })
      }
      this.$confirm('确认重置吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const data = {
          employeeIds: this.multipleSelection.map((item) => item.employeeId)
        }
        const res = await updateOne('resetEmployeeRecordPassword', data)
        if (res) {
          this.$notify({
            title: '成功',
            message: '重置成功',
            type: 'success',
            duration: 2000
          })
          this.resetTemp()
          this.getList()
        }
      }).catch(() => {
      })
    },
    // 一键修改社保
    updateRecordSecurity() {
      this.recordSecurityVisible = true
    },
    // 回车确定修改社保
    sureFind() {
      let data
      if (this.filterCondition.organId) {
        data = {
          groupId: this.filterCondition.groupId,
          organId: this.filterCondition.organId,
          socialMoney: this.socialMoney
        }
      } else {
        data = {
          groupId: this.filterCondition.groupId,
          socialMoney: this.socialMoney
        }
      }
      const res = updateOne('updateEmployeeRecordSecurity', data)
      if (res) {
        this.$notify({
          title: '成功',
          message: '修改社保成功',
          type: 'success'
        })
        this.recordSecurityVisible = false
        this.socialMoney = ''
        this.handleRefresh()
      }
    },
    handleCreate() {
      if (!this.filterCondition.organId) {
        this.$message({
          showClose: true,
          message: '请选择所属组织',
          type: 'warning',
          center: true
        })
        return
      }
      this.dialogKey += 1
      this.resetTemp()
      this.temp.groupId = this.filterCondition.groupId
      this.temp.organId = this.filterCondition.organId
      this.dialogStatus = 'add'
      this.dialogFormVisible = true
      this.temp.inDate = this.$moment().format('YYYY-MM-DD')
      this.temp.genderId = '02'
      this.temp.salaryCodeId = '01'
      this.temp.salaryTypeId = '01'
      this.$nextTick(() => {
        this.$refs['employeeDataForm'].clearValidate()
      })
      this.getPostIds(this.filterCondition.organId)
    },
    handleUpdate(row) {
      this.temp.photo = ''
      this.temp.identPhotoA = ''
      this.temp.identPhotoB = ''
      this.getPostIds(this.filterCondition.organId)
      this.getAttendanceData()
      this.setTemp(row)
      this.currentTab = 'dbInfo'
      this.currentRow = row
      this.dialogKey += 1
      this.dialogStatus = 'edit'
      this.dialogFormVisible = true

      getList('employeeDetail', { employeeId: row.employeeId }).then(res => {
        const tmp = res.data.pageItems
        if (tmp[0].relations !== null) {
          tmp[0].relations = tmp[0].relations.split(',')
        }
        if (tmp && tmp.length > 0) {
          this.setTemp(tmp[0])
        }
      })
      getList('employeeImg', { employeeId: row.employeeId }).then(res => {
        const tmp = res.data.pageItems
        if (tmp && tmp.length > 0) {
          this.setTemp(tmp[0])
          Object.assign(this.imgs, tmp[0])
        }
      })
      this.$nextTick(() => {
        this.$refs['employeeDataForm'].clearValidate()
      })
    },
    handleCancel() {
      this.$confirm('是否放弃保存?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.dialogFormVisible = false
        this.resetTemp()
      }).catch(() => {
      })
    },
    handleConfirm() {
      switch (this.dialogStatus) {
        case 'add':
          this.createData()
          break
        case 'edit':
          this.updateData()
          break
        default:
          break
      }
    },
    validMultiFile() {
      return this.temp.photo && this.temp.identPhotoA && this.temp.identPhotoB
    },
    createData() {
      this.$refs['employeeDataForm'].validate(async (valid) => {
        // if (valid && this.validMultiFile()) { // 添加图片必选验证
        if (valid) {
          if (this.temp.statusId !== '03') {
            delete this.temp.outDate
          }
          // 删除remark
          const temp = Object.assign({}, this.temp)
          temp.relations = temp.relations.join(',')
          delete temp.remark
          const res = await addOneByForm('employee', temp)
          if (res) {
            this.dialogFormVisible = false
            this.$notify({
              title: '成功',
              message: '创建成功',
              type: 'success',
              duration: 2000
            })
            this.getList()
            this.resetTemp()
          }
        } else {
          this.$alert('有必选项未填', '警告', {
            confirmButtonText: '确定'
          })
          return false
        }
      })
    },
    updateData() {
      function separate(tmp) {
        const sep = {
          basic: {
            employeeId: tmp.employeeId,
            employeeName: tmp.employeeName,
            tel: tmp.tel,
            groupId: tmp.groupId,
            organId: tmp.organId,
            departId: tmp.departId,
            postId: tmp.postId,
            employeeCode: tmp.employeeCode,
            statusId: tmp.statusId,
            inDate: tmp.inDate,
            identNO: tmp.identNO,
            nationId: tmp.nationId,
            regionId: tmp.regionId,
            provinceId: tmp.provinceId,
            cityId: tmp.cityId,
            countyId: tmp.countyId,
            townId: tmp.townId,
            accountNum: tmp.accountNum,
            accountBank: tmp.accountBank
          },
          detail: {
            employeeId: tmp.employeeId,
            homeAddr: tmp.homeAddr,
            genderId: tmp.genderId,
            educationId: tmp.educationId,
            marriageId: tmp.marriageId,
            houseName: tmp.houseName,
            shortTel: tmp.shortTel,
            localTel: tmp.localTel,
            contacter: tmp.contacter,
            contactTel: tmp.contactTel,
            contactRelat: tmp.contactRelat,
            salaryCodeId: tmp.salaryCodeId,
            salaryTypeId: tmp.salaryTypeId,
            subsidyLevel: tmp.subsidyLevel,
            laborContract: tmp.laborContract,
            relations: tmp.relations,
            socialNO: tmp.socialNO,
            socialMoney: tmp.socialMoney,
            leaveTypeId: tmp.leaveTypeId,
            note: tmp.note,
            // remark: tmp.remark,
            bIsUnLuYong: tmp.bIsUnLuYong,
            statusDate: tmp.statusDate
          },
          imgs: {
            employeeId: tmp.employeeId,
            photo: tmp.photo,
            identPhotoA: tmp.identPhotoA,
            identPhotoB: tmp.identPhotoB
          }
        }
        return sep
      }
      this.$refs['employeeDataForm'].validate(async (valid) => {
        // if (valid && this.validMultiFile()) { // 添加图片必选验证
        if (valid) {
          const tmp = separate(this.temp)
          if (this.temp.statusId === '03') {
            tmp.basic.outDate = this.temp.outDate
          }
          // 如果照片和刚开始的不符合,就不传参数
          if (tmp.imgs.photo === this.imgs.photo) {
            delete tmp.imgs.photo
          }
          if (tmp.imgs.identPhotoA === this.imgs.identPhotoA) {
            delete tmp.imgs.identPhotoA
          }
          if (tmp.imgs.identPhotoB === this.imgs.identPhotoB) {
            delete tmp.imgs.identPhotoB
          }
          const res = await updateOneByForm('employee', { ...tmp.basic, ...tmp.detail, ...tmp.imgs })
          if (res) {
            this.dialogFormVisible = false
            this.$notify({
              title: '成功',
              message: '更新成功',
              type: 'success',
              duration: 2000
            })
            this.getList()
            this.resetTemp()
          }
        } else {
          this.$alert('有必选项未填', '警告', {
            confirmButtonText: '确定'
          })
          return false
        }
      })
    },
    handleDelete(row) {
      this.$confirm('确认要删除该行吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const tmp = {
          employeeIds: [row.employeeId]
        }
        const res = await deleteBatch('employee', tmp)
        if (res) {
          this.$notify({
            title: '成功',
            message: '删除成功',
            type: 'success',
            duration: 2000
          })
        }
        this.getList()
        this.resetTemp()
      }).catch(() => {
      })
    },
    handlePrint() {
      if (this.multipleSelection.length === 0) {
        return this.$message({
          showClose: true,
          message: '请选择一条记录',
          type: 'warning',
          center: true
        })
      }
      this.getPrintData()
      this.innerVisiblePrintEmployee = true
    },
    getPrintData() {
      this.printLoading = true
      this.printData = []
      axios.all(this.multipleSelection.map(item => {
        // 列表的,详细的供应商,详细的组织,详细的买卖
        const { employeeId } = item
        return this.getDetailForPrint(employeeId)
      })).then((resArray) => {
        resArray.forEach((res, index) => {
          const panel = Object.assign({}, this.multipleSelection[index])
          panel.img = !res[0] ? '' : res[0]
          this.printData.push(panel)
          this.printLoading = false
        })
      })
    },
    async getDetailForPrint(employeeId) {
      const params = { employeeId }
      const res = await axios.all([
        getList('employeeRecordForPrint', params)
      ])
      return [res[0].data.pageItems[0]]
    },
    handleRefresh() {
      this.currentPlus = 0
      this.currentErrPlus = 0
      this.getDepartId()
      this.getSearchPost()
      this.getList()
      this.resetTemp()
    },
    handleNodeClick(data, node, component) {
      switch (data.type) {
        case 'group':
          this.filterCondition.groupId = data.id
          delete this.filterCondition.organId
          this.getDepartId()
          this.getSearchPost()
          this.getList()
          break
        case 'organ':
          this.filterCondition.groupId = node.parent.data.id
          this.filterCondition.organId = data.id
          this.getDepartId()
          this.getSearchPost()
          this.getList()
          this.getPostIds(this.filterCondition.organId)
          this.getMachine()
          break
      }
      this.resetTemp()
      this.getOrganIds(this.filterCondition.groupId)
    },
    handleRowClick(row, column, event) {
      this.setTemp(row)
      this.currentRow = row
    },
    handleStatusId(val) {
      if (val === '03' && this.temp.outDate === null) {
        this.temp.outDate = this.$moment().format('YYYY-MM-DD')
      } else {
        this.temp.outDate = null
      }
      if (val === '03') {
        this.temp.salaryTypeId = '20'
      }
      let data
      const intranet = this.faceAttendanceData.map(item => item.intranetNet)
      const port = this.faceAttendanceData.map(item => item.port)
      const passWord = this.faceAttendanceData.map(item => item.userPassword)
      if (val === '03' && this.currentRow.faceRecognition === 1) {
        data = {
          intranet,
          port,
          passWord,
          id: this.currentRow.attendanceId,
          operationType: 2
        }
        ProduceManageAPI.upStrategy(data)
      } else if (val === '02' && this.currentRow.faceRecognition === 1 || val === '01' && this.currentRow.faceRecognition === 1) {
        data = {
          intranet,
          port,
          passWord,
          id: this.currentRow.attendanceId,
          operationType: 1
        }
        ProduceManageAPI.upStrategy(data)
      }
    },
    handleTableSort({ prop, order }) {
      this.filterCondition.sortName = order === null ? '' : prop
      this.filterCondition.sortType = order === 'descending' ? 1 : 0
      this.getList()
    },
    addEmployeeAvatar(file) {
      const isImage =
        file.raw.type === 'image/png' ||
        file.raw.type === 'image/jpg' ||
        file.raw.type === 'image/PNG' ||
        file.raw.type === 'image/gif' ||
        file.raw.type === 'image/jpeg'
      if (!isImage) {
        this.$message.error('上传只能是png,jpg,jpeg,gif格式!')
      } else {
        const kbSize = file.size / 1024
        if (kbSize > 500) {
          return this.$message({
            showClose: true,
            message: '该图片不符合,尺寸大于500k',
            type: 'warning',
            center: true
          })
          // compressImage(file.raw, 1000, 1000).then(res => {
          //   this.temp.photo = res.substring(res.indexOf(',') + 1)
          // })
        } else {
          fileToURL(file.raw).then(res => {
            this.temp.photo = res.substring(res.indexOf(',') + 1)
          })
        }
      }
    },
    addEmployeeIDCardA(file) {
      const kbSize = file.size / 1024
      if (kbSize > 100) {
        compressImage(file.raw, 400, 400).then(res => {
          this.temp.identPhotoA = res.substring(res.indexOf(',') + 1)
        })
      } else {
        fileToURL(file.raw).then(res => {
          this.temp.identPhotoA = res.substring(res.indexOf(',') + 1)
        })
      }
    },
    addEmployeeIDCardB(file) {
      const kbSize = file.size / 1024

      if (kbSize > 100) {
        compressImage(file.raw, 400, 400).then(res => {
          this.temp.identPhotoB = res.substring(res.indexOf(',') + 1)
        })
      } else {
        fileToURL(file.raw).then(res => {
          this.temp.identPhotoB = res.substring(res.indexOf(',') + 1)
        })
      }
    },
    setPosition(val) {
      this.temp.employeeCode = val.postLevelCode
      this.temp.departId = val.departId
      this.temp.departName = val.departName
      this.constants[6].data.map(item => {
        var newDepartName = item.name.substring(0, item.name.length - 2)
        if (val.departName === newDepartName) {
          this.temp.salaryTypeId = item.id
        }
        if (val.departName === '营运A班') {
          this.temp.salaryTypeId = '07'
        }
        if (val.departName === '营运B班') {
          this.temp.salaryTypeId = '08'
        }
      })
    },
    handleChangeRegion() {
      const temp = this.temp
      const levelProps = {
        1: {
          id: 'regionId',
          name: 'region'
        },
        2: {
          id: 'provinceId',
          name: 'province'
        },
        3: {
          id: 'cityId',
          name: 'city'
        },
        4: {
          id: 'countyId',
          name: 'county'
        },
        5: {
          id: 'townId',
          name: 'town'
        }
      }
      function setRegionFromBottom(node) {
        if (!node) return
        const level = node.data.level
        const { regionId, regionName } = node.data
        temp[levelProps[level].id] = regionId
        temp[levelProps[level].name] = regionName
        setRegionFromBottom(node.parent)
      }
      const nodes = this.$refs['regionCascader'].getCheckedNodes()
      if (nodes.length > 0) {
        const node = nodes[0]
        setRegionFromBottom(node)
      }
    },
    handleChangeFilter() {
      this.listQuery.page = 1
      this.getList()
      this.resetTemp()
    },
    handleChangeDate(value) {
      this.from.beginDate = ''
      this.from.endDate = ''
      if (value instanceof Array && value.length === 2) {
        this.from.beginDate = value[0]
        this.from.endDate = value[1]
      }
      this.listQuery.page = 1
      this.getList()
      this.resetTemp()
    },
    handleBCheckProb() {
      this.listQuery.page = 1
      this.getList()
      this.resetTemp()
    },
    changeTab(tab) {
      if (tab.name === 'histroy') {
        this.getEmployeeRecordHistory()
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    async getEmployeeRecordHistory() {
      this.recordHistoryLoading = true
      const params = {
        employeeId: this.temp.employeeId
      }
      const res = await getList('employeeRecordHistory', params)
      this.recordHistoryLoading = false
      this.recordHistory = res.data.pageItems
    },
    handleAdvancedQuery(query) {
      this.filterCondition.filter = query.reduce((acc, cur) => acc + ' ' + cur, '')
      this.getList()
    },
    handleCheckProb() {
      if (this.multipleSelection.length === 0) {
        return this.$message({
          showClose: true,
          message: '请勾选要修改的数据',
          type: 'warning',
          center: true
        })
      }
      this.$confirm('确认要转正吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const employeeIds = this.multipleSelection.map((item) => item.employeeId)
        const res = await updateOne('updateEmployeeRecordForTrial', { employeeIds })
        if (res) {
          this.$notify({
            title: '成功',
            message: '转正成功',
            type: 'success',
            duration: 2000
          })
          this.resetTemp()
          this.getList()
        }
      }).catch(() => { })
    },
    async changeIdentNO() {
      if (!this.temp.identNO) return
      const data = {
        identNO: this.temp.identNO
      }
      const res = await selectOne('autoEmployeeRecordcheck', data)
      if (res.code === 0) {
        this.$message({
          showClose: true,
          message: '满足年龄和入职要求',
          type: 'success',
          center: true
        })
      }
    },
    // 输入身份证号关联性别,出生日期
    handleEmployeeChange(val) {
      this.temp.identNO = val
      this.changeIdentNO()
      const newVal = val.substring(16, 17)
      this.temp.birth = val.substring(6, 10) + '-' + val.substring(10, 12) + '-' + val.substring(12, 14)
      if ((newVal % 2) === 1) { this.temp.genderId = '01' } else if ((newVal % 2) === 0) {
        this.temp.genderId = '02'
      }
    },
    // 指纹录入
    handleFingerInput() {
      if (this.multipleSelection.length === 0) {
        return this.$message({
          showClose: true,
          message: '请勾选一条数据',
          type: 'warning',
          center: true
        })
      }
      this.FingerInputVisible = true
    },
    FingerInputSureFind() {
      clearInterval(this.timeId)
      this.sureFindLoading = true
      let data = {}
      if (this.fingerInputForm.intranet) {
        const intranet = [this.fingerInputForm.intranet]
        const port = [this.fingerInputForm.port]
        const dwMachineNumber = [this.fingerInputForm.dwMachineNumber]
        data = {
          intranet,
          port,
          number: this.fingerInputForm.number,
          dwMachineNumber,
          name: this.fingerInputForm.name
        }
      } else {
        const intranet = this.attendanceData.map(item => item.intranetNet)
        const port = this.attendanceData.map(item => item.port)
        const dwMachineNumber = this.attendanceData.map(item => item.dwMachineCode)
        data = {
          intranet,
          port,
          number: this.multipleSelection[0].attendanceId,
          dwMachineNumber,
          name: this.multipleSelection[0].employeeName
        }
      }
      ProduceManageAPI.insertBatchUser(data).then(res => {
        if (res) {
          if (this.resFlog) {
            this.FingerInputVisible = false
            this.$notify({
              title: '成功',
              message: '录入指纹成功',
              type: 'success'
            })
          } else {
            const temp = {
              groupId: this.filterCondition.groupId,
              organId: this.filterCondition.organId,
              employeeId: this.multipleSelection[0].employeeId,
              fingerPrint: this.baseFinger
            }
            insertOne('insertAttendMessageFinger', temp).then(tmp => {
              this.FingerInputVisible = false
              if (tmp) {
                this.$notify({
                  title: '成功',
                  message: '录入指纹成功',
                  type: 'success'
                })
              }
            })
          }
          this.sureFindLoading = false
        }
      })
    },
    handleFingerInformation() {
      ProduceManageAPI.getTemplate().then(res => {
        if (res) {
          this.resFlog = Array.isArray(res.data.pageItems)
          if (Array.isArray(res.data.pageItems)) {
            this.FingerInputImage = res.data.pageItems[0] || ''
            this.FingerInputImageA = res.data.pageItems[1] || ''
            this.FingerInputImageB = res.data.pageItems[2] || ''
            this.baseFinger = ''
          } else {
            this.FingerInputImage = res.data.pageItems.strBase64[0] || ''
            this.FingerInputImageA = res.data.pageItems.strBase64[1] || ''
            this.FingerInputImageB = res.data.pageItems.strBase64[2] || ''
            this.baseFinger = res.data.pageItems.strBaseFinger || ''
          }
        }
      })
    },
    setIntranet(row) {
      this.fingerInputForm.intranet = row.intranetNet
      this.fingerInputForm.port = row.port
      this.fingerInputForm.number = this.multipleSelection[0].attendanceId
      this.fingerInputForm.dwMachineNumber = row.dwMachineCode
      this.fingerInputForm.name = this.multipleSelection[0].employeeName
    },
    clearFingerInputForm() {
      this.fingerInputForm.intranet = ''
      this.fingerInputForm.port = ''
      this.fingerInputForm.number = ''
      this.fingerInputForm.dwMachineNumber = ''
      this.fingerInputForm.name = ''
      this.FingerInputImage = ''
      this.FingerInputImageA = ''
      this.FingerInputImageB = ''
    },
    // 获取消费机信息
    async getMachine() {
      const tmp = {
        groupId: this.filterCondition.groupId,
        organId: this.filterCondition.organId,
        equipmentType: '02'
      }
      const result = await selectOne('getConsumerMachine', tmp)
      this.machineList = result.data.pageItems
    },
    async getAttendanceData() {
      const params = {
        groupId: this.filterCondition.groupId,
        organId: this.filterCondition.organId
      }

      const res = await selectOne('getAttendanceMessage', params)
      this.attendanceData = res.data.pageItems.filter(item => item.equipmentType === '01')
      this.faceAttendanceData = res.data.pageItems.filter(item => item.equipmentType === '02')
      if (this.machineList.length !== 0) {
        Array.prototype.push.apply(this.faceAttendanceData, this.machineList)
      }
    },
    getFingerprintTemplate() {
      ProduceManageAPI.getFingerprintTemplate().then(res => {
        if (res.data.code === 0) {
          this.resetDisabled = true
          this.$message({
            showClose: true,
            message: res.data.message,
            type: 'success',
            duration: '5000'
          })
        } else {
          this.resetDisabled = false
          this.$message({
            showClose: true,
            message: res.data.message,
            type: 'warning',
            duration: '5000'
          })
        }
      })
    },
    handleResetConnect() {
      ProduceManageAPI.getFingerprintTemplate().then(res => {
        if (res.data.code === 0) {
          this.resetDisabled = true
          this.$message({
            showClose: true,
            message: res.data.message,
            type: 'success',
            duration: '5000'
          })
        } else {
          this.resetDisabled = false
          this.$message({
            showClose: true,
            message: res.data.message,
            type: 'warning',
            duration: '5000'
          })
        }
      })
    },
    handleOperate(cmd) {
      if (this.multipleSelection.length === 0) {
        return this.$message({
          showClose: true,
          message: '请勾选一条数据',
          type: 'warning',
          center: true
        })
      }
      this.accountLoading = false
      this.resetAccountStatus = false
      if (cmd === 'sets') {
        this.subAccountVisible = true
        this.subAccountTitle = '设置子账号'
      } else {
        this.deleteSubAccount()
      }
    },
    setSubAccount() {
      this.$refs.subAccountForm.validate(valid => {
        if (valid) {
          this.accountLoading = true
          if (!this.resetAccountStatus) {
            const params = {
              subPhone: this.temp.tel,
              subName: this.temp.employeeCode,
              pwd: this.subAccountForm.subPassword,
              groupId: this.filterCondition.groupId,
              organId: this.filterCondition.organId
            }
            SystemSettingAPI.addOne('insertSubAccount', params).then(res => {
              if (res.code === 0) {
                this.$notify({
                  title: '成功',
                  message: '修改成功',
                  type: 'success',
                  duration: 2000
                })
                this.subAccountVisible = false
                this.accountLoading = false
                this.handleRefresh()
              } else {
                this.accountLoading = false
              }
            })
          } else {
            const params = {
              employeeIds: [this.temp.employeeId],
              pwd: this.subAccountForm.subPassword
            }
            updateOne('resetEmployeeRecordPassword', params).then(res => {
              if (res) {
                this.$notify({
                  title: '成功',
                  message: '重置成功',
                  type: 'success',
                  duration: 2000
                })
                this.subAccountVisible = false
                this.accountLoading = false
                this.resetTemp()
                this.getList()
              } else {
                this.accountLoading = false
              }
            })
          }
        }
      })
    },
    deleteSubAccount() {
      const params = {
        subPhone: this.temp.tel,
        subName: this.temp.employeeCode
      }
      this.$confirm('确认取消吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        SystemSettingAPI.deleteBatch('deleteSubAccount', params).then(res => {
          if (res) {
            this.$notify({
              title: '成功',
              message: '取消成功',
              type: 'success',
              duration: 2000
            })
            this.handleRefresh()
          }
        })
      }).catch()
    },
    handleTips() {
      if (this.multipleSelection.length !== 1) {
        return this.$message({
          showClose: true,
          message: '请勾选一条数据',
          type: 'warning',
          center: true
        })
      }
      if (this.multipleSelection[0].consumerId === '' || this.multipleSelection[0].consumerId === null) {
        this.$confirm('确认发卡吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(
          async () => {
            const data = {
              organId: this.filterCondition.organId,
              groupId: this.filterCondition.groupId,
              employeeId: this.multipleSelection[0].employeeId
            }
            const res = await selectOne('hairCardConsumerMachineId', data)
            if (res) {
              if (this.multipleSelection[0].consumerId === res.data.pageItems[0].consumerId) {
                return this.$message.error('发卡失败，请重新发卡')
              }
              this.hairpinrVisible = true
              this.hairpinrForm.id = res.data.pageItems[0].consumerId
              this.multipleSelection[0].consumerId = res.data.pageItems[0].consumerId
            }
          }
        )
          .catch(() => {
            console.log()
          })
      } else {
        this.$confirm('已发卡，是否确认重新发卡！', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(
          async () => {
            const data = {
              organId: this.filterCondition.organId,
              groupId: this.filterCondition.groupId,
              employeeId: this.multipleSelection[0].employeeId
            }
            const res = await selectOne('hairCardConsumerMachineId', data)
            if (res) {
              if (this.multipleSelection[0].consumerId === res.data.pageItems[0].consumerId) {
                return this.$message.error('发卡失败，请重新发卡')
              }
              this.hairpinrVisible = true
              this.hairpinrForm.id = res.data.pageItems[0].consumerId
              this.multipleSelection[0].consumerId = res.data.pageItems[0].consumerId
            }
          }
        )
          .catch(() => {
            console.log()
          })
      }
    },
    handleMacAddress() {
      if (this.multipleSelection.length !== 1) {
        return this.$message({
          showClose: true,
          message: '请选中一条数据',
          type: 'warning',
          center: true
        })
      }
      this.macAddress = ''
      this.addressVisible = true
    },
    async handleConfirmMacAddress() {
      const data = {
        macAddress: this.macAddress,
        employeeId: this.multipleSelection[0].employeeId
      }
      const res = await updateOne('insertEmployeeRecordMacAddress', data)
      if (res) {
        this.$notify({
          title: '成功',
          message: '绑定mac地址成功',
          type: 'success',
          duration: 2000
        })
        this.addressVisible = false
        this.handleRefresh()
      }
    },
    // 录入
    handleInputPersonnel(command) {
      switch (command) {
        case 'finger':
          this.handleFingerInput()
          break
        case 'face':
          this.handleFaceInput()
          break
      }
    },
    // 人脸注册
    handleFaceInput() {
      if (this.multipleSelection.length === 0 || this.multipleSelection.length > 20) {
        return this.$message({
          showClose: true,
          message: '请批量勾选二十条以下数据',
          type: 'warning',
          center: true
        })
      }
      this.statusFlag = this.multipleSelection.some(item => {
        return item.statusId === '03'
      })
      this.FaceInputVisible = true
    },
    // 人脸选择ip地址
    setFaceIntranet(row) {
      this.faceInputForm.password = row.userPassword
      this.faceInputForm.port = row.port
      this.faceInputForm.intranet = row.intranetNet
    },
    faceInputSureFind() {
      if (this.statusFlag) {
        return this.$message({
          showClose: true,
          message: '非离职人员才可录入',
          type: 'warning',
          center: true
        })
      }
      this.faceLoading = true
      let data = {}
      if (this.faceInputForm.intranet) {
        const intranet = [this.faceInputForm.intranet]
        const port = [this.faceInputForm.port]
        const password = [this.faceInputForm.password]
        data = {
          intranet,
          port,
          password
        }
      } else {
        const intranet = this.faceAttendanceData.map(item => item.intranetNet)
        const port = this.faceAttendanceData.map(item => item.port)
        const password = this.faceAttendanceData.map(item => item.userPassword)
        data = {
          intranet,
          port,
          password
        }
      }
      ProduceManageAPI.faceRecognition(data).then(res => {
        if (res) {
          this.errorList = []
          this.correctList = []
          let tmp
          this.multipleSelection.forEach(item => {
            let err = {}
            getList('employeeImg', { employeeId: item.employeeId }).then((res) => {
              if (res.data.pageItems.length === 0) {
                tmp = {
                  name: item.employeeName,
                  id: item.attendanceId,
                  idNumber: item.identNO,
                  label: item.departName,
                  file: '',
                  addType: item.faceRecognition
                }
              } else {
                tmp = {
                  name: item.employeeName,
                  id: item.attendanceId,
                  idNumber: item.identNO,
                  label: item.departName,
                  file: res.data.pageItems[0].photo,
                  addType: item.faceRecognition
                }
              }
              ProduceManageAPI.addVisitors(tmp).then(result => {
                if (result.data.code === 0) {
                  const data = {
                    organId: this.filterCondition.organId,
                    groupId: this.filterCondition.groupId,
                    employeeIds: [item.employeeId]
                  }
                  ProduceManageAPI.updateFaceStatus(data).then((res) => {
                    if (res) {
                      this.currentPlus++
                    }
                  })
                } else {
                  this.currentErrPlus++
                  err = {}
                  err.employeeName = item.employeeName
                  this.errorList.push(Object.assign({}, err))
                }
              })
            })
          })
        }
      })
    },
    showPwd() {
      if (this['passwordType'] === 'password') {
        this['passwordType'] = ''
      } else {
        this['passwordType'] = 'password'
      }
    },
    // 人脸注册结束提示
    faceOverTips() {
      if (this.errorList.length === 0) {
        this.$notify({
          title: '成功',
          message: '人脸注册成功',
          type: 'success',
          duration: 2000
        })
        this.faceLoading = false
        this.FaceInputVisible = false
        this.handleRefresh()
      } else {
        this.content = this.errorList.map(item => { return item.employeeName }).join(',')
        this.$notify({
          title: '失败',
          message: this.content + '人脸注册失败，请更换图片重新注册',
          type: 'error',
          duration: 5000
        })
        this.faceLoading = false
        this.FaceInputVisible = false
        this.handleRefresh()
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.row-label {
  line-height: 28px !important;
  display: inline-block;
  text-align: right;
  vertical-align: middle;
  float: none;
  font-size: 14px;
  color: #606266;
  line-height: 40px;
  padding: 0 12px 0 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.align-right {
  text-align: right;
}
.img-box {
  width: 200px;
  height: 200px;
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  text-align: center;
  img {
    border: 1px dashed #d9d9d9;
    width: 100%;
  }
  .upload-tip {
    margin-top: 80px;
  }
}
.nativeCity {
  .el-input__inner::-webkit-input-placeholder {
    /* WebKit browsers 适配谷歌 */
    color: #606266;
  }
  .el-input__inner:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 适配火狐 */
    color: #606266;
  }
  .el-input__inner::-moz-placeholder {
    /* Mozilla Firefox 19+ 适配火狐 */
    color: #606266;
  }
  .el-input__inner:-ms-input-placeholder {
    /* Internet Explorer 10+  适配ie*/
    color: #606266;
  }
}
.employee-inputs {
  .el-form-item {
    margin-right: 10px !important;
    .el-input--suffix .el-input__inner {
      padding-right: 0px !important;
    }
    .el-radio {
      margin-right: 5px !important;
    }
    .el-date-editor {
      width: 180px;
    }
  }
}
.el-form-item {
  margin: 18px auto 0;
  width: 100%;
  .el-input {
    //position: relative;
  }
  .show-pwd {
    position: absolute;
    right: 4px;
    //top: 10px;
    font-size: 16px;
    cursor: pointer;
    user-select: none;
  }
}
.history-remark {
  input:disabled,
  textarea:disabled {
    opacity: 1;
    -webkit-text-fill-color: black;
  }
}
.bCheckProb {
  padding: 0 !important;
}
</style>
